div.hy-prev,
div.hy-next {
    width: 37px;
    height: 53px;
    border-radius: 0;
}

div.hy-prev:hover,
div.hy-next:hover {
    background-color: rgb(0, 0, 0, .6);
}

.hy-prev {
    left: 0;
}

.hy-next {
    right: 0;
}

.hy-dot-right {
    position: absolute;
    right: 0;
    bottom: 0;
    /* background-color: #fff; */
    width: 270px;
    height: 52px;
}

.hy-dot {}

.hy-dot i {
    width: 30px;
    height: 30px;
    line-height: 30px;
    background-color: #fff;
    opacity: 0.6;
    margin: 0 9px 0 0;
}

.hy-dot i:before {
    content: '1';
    font-weight: normal;
    font-style: normal;
    font-size: 16px;
    position: relative;
    left: 50%;
    margin-left: -5px;
}

.hy-dot i:nth-child(2):before {
    content: '2';
}

.hy-dot i:nth-child(3):before {
    content: '3';
}

.hy-dot i:nth-child(4):before {
    content: '4';
}

.hy-dot i:nth-child(5):before {
    content: '5';
}

.hy-dot i.active {
    color: #fff;
    background-color: #f40;
    opacity: 1;
}